<!--
 * @Author: levi7754 levi7754@163.com
 * @Date: 2025-05-13 16:31:23
 * @LastEditors: levi7754 levi7754@163.com
 * @LastEditTime: 2025-10-12 20:45:04
 * @FilePath: \ruoyi-mall-uniapp\src\pages\index\contact.vue
 * @Description: 客户联系人
-->
<template>
  <view class="udp-tabbar-contact">
    <!-- <uni-nav-bar leftWidth="0" rightWidth="60rpx" backgroundColor="#EA0D2C" rightIcon="plusempty" color="#FFF">
      <view class="input-view">
        <uni-icons
          class="input-uni-icon"
          type="search"
          size="18"
          color="#999"
        />
        <input
          confirm-type="search"
          class="nav-bar-input"
          type="text"
          placeholder="输入搜索关键词"
          @confirm="confirm"
        />
      </view>
      
    </uni-nav-bar> -->
		<ut-indexed
			v-if="dataList?.length"
			:data="dataList"
			:keywords="['customer_name', 'customer_phone', 'phone']"
			show-right-button
			:swiper-enable="false"
			nameField="customer_name"
			background-color="#EA0D2C"
			:key="refreshKey"
			@buttonTap="onTap"
		>	
			<template #right-icon>
				<uni-icons
					type="plusempty"
					size="24"
					color="#FFF"
					style="padding-right: 12rpx; font-weight: bolder;"
					@tap="onRightIconTap"
				/>
			</template>
			<template #content="{data}">
				<view class="ut-contact-item" @tap="onItemTap(data)">
					<view class="ut-item-pic" style="padding-right: 12rpx;">
						 <image
              class="ut-pic-img"
              :src="udp.$url.cdn(data.store_photo_url || '/static/img/avatar.png')"
              mode="aspectFill"
            />
					</view>
					<view>
						<view style="font-weight: bold;">{{ data.customer_name }}</view>
						<view style="padding: 10rpx 0;">{{ data.customer_phone }}</view>
						<view style="font-size: 12px; color: rgba(0, 0, 0, 0.6);">{{ data.zone || "Norcal" }}</view>
					</view>
				</view>
			</template>
		</ut-indexed>
  </view>
</template>
<script setup>
import { nextTick, ref } from "vue"
import { onShow } from '@dcloudio/uni-app'
import { useStore } from "vuex"
import { fileUrl, udp } from "@/utils"
import { ajax } from "@/http"
// import sheep from "@/sheep"

const dataList = ref([])
const refreshKey = ref(0)

const store = useStore()
const onTap = (item, idx) => {
	console.log(item, idx)
	if (idx === 0) {
		sheep.$store("customer").$patch(state => {
			console.log(state)
			state.current = item
			nextTick(() => {
				navigateTo("/pages/index/shop", { data: item })
			})
		})
	}
}

const onItemTap = (item) => {
	sheep.$store('customer').$patch(state => {
		state.current = item
		console.log({item})
		nextTick(() => {
			navigateTo("/pages/workbench/customer/customer-home")
		})
	})
}
/** 新增客户 */
const onRightIconTap = () => {
	navigateTo("/pages/workbench/customer/add-customer")
}

const getDataList = (e, idx) => {

	const sale_department_id = !store.state.user.queryAllCustomer ? store.state.user.saleOrgConfig.departmentId : null
  const url = "/nature-business/api/customer/page"
	console.log(sale_department_id)
  ajax.get(url, { currPage: 1, pageSize: 200, sale_department_id: null }).then(res => {
    console.log("----------------", res)
		const list = res.list
		list.forEach(_ => {
      if (_.store_photo_url) {
        _.store_photo_url = fileUrl + _.store_photo_url
			}
		})
    console.log("----------------", list)
		dataList.value = list
		refreshKey.value++
	})
}

onShow(() => {
	getDataList()
})
</script>

<style lang="scss">

$nav-height: 30px;

.ut-contact-item {
	padding: 12rpx 12rpx 12rpx 0;
	margin-left: 12rpx;
	border-bottom: 1px solid #e5e5e5;
	width: 100%;

	display: flex;
	align-items: center;
	
	.ut-item-pic {
		border-radius: 20rpx;
		.ut-pic-img {
			width: 160rpx;
			height: 160rpx;
			margin-right: 20rpx;
			border-radius: 10%;
		}
	}
}
.uni-swipe:last-of-type .ut-contact-item {
	border: none;
}
.udp-tabbar-contact {
  .input-view {
    /* #ifndef APP-PLUS-NVUE */
    display: flex;
    /* #endif */
    flex-direction: row;
    // width: 500rpx;
    flex: 1;
    background-color: #f8f8f8;
    height: $nav-height;
    border-radius: 15px;
    padding: 0 15px;
    flex-wrap: nowrap;
    margin: 7px 0;
    line-height: $nav-height;
  }
  
  .input-uni-icon {
    line-height: $nav-height;
  }
  
  .nav-bar-input {
    height: $nav-height;
    line-height: $nav-height;
    /* #ifdef APP-PLUS-NVUE */
    width: 370rpx;
    /* #endif */
    padding: 0 5px;
    font-size: 12px;
    background-color: #f8f8f8;
  }
}


</style>